<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html class="no-js" lang="">
<head>
    <!-- Meta Data -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>聊天页面</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Favicon -->
    <%--<link rel="shortcut icon" type="image/x-icon" href="${pageContext.request.contextPath}/static/media/favicon.png">--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/bootstrap/css/bootstrap.min.css">--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/icofont/icofont.min.css">--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/slick-carousel/css/slick.css">--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/slick-carousel/css/slick-theme.css">--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/magnific-popup/css/magnific-popup.css">--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/sal.js/sal.css" type="text/css">--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/select2/css/select2.min.css" type="text/css">--%>

    <%--<!-- Site Stylesheet -->--%>
    <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/app.css">--%>

    <%--<!-- Google Web Fonts -->--%>
    <%--<link href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,600;0,700;0,800;0,900;1,400&display=swap" rel="stylesheet">--%>
<style>
    .aaaa{
        width: 44px;
    }
</style>
</head>

<body class="">
<div class="chat-conversion-box" id="chat-box-modal" tabindex="-1" aria-labelledby="chat-modal-label" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="chat-modal-label">Fahim Rahman <span class="online"></span></h6>
                <div class="action-icon">
                    <button class="chat-shrink"><i class="icofont-minus"></i></button>
                    <button type="button" class="close chat-close chat-open" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
            </div>
            <div class="modal-body">
                <ul class="chat-conversion">
                    <li class="chat-others">
                        <div class="author-img">
                            <img src="${pageContext.request.contextPath}/static/media/figure/chat_12.jpg" alt="Chat">
                        </div>
                        <div class="author-text">
                            <span>How are you Fahim vai ? Tommorow office will be your last day of Bachelor life.</span>
                        </div>
                    </li>
                    <li class="chat-you">
                        <div class="author-img">
                            <img src="${pageContext.request.contextPath}/static/media/figure/chat_11.jpg" alt="Chat">
                        </div>
                        <div class="author-text">
                            <span>hmm That's great</span>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="modal-footer">
                <form>
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Write your text here.....">
                        <div class="chat-plus-icon"><i class="icofont-plus-circle"></i></div>
                        <div class="file-attach-icon">
                            <a href="#"><i class="icofont-slightly-smile"></i></a>
                            <a href="#"><i class="icofont-camera"></i></a>
                            <a href="#"><i class="icofont-image"></i></a>
                            <a href="#"><i class="icofont-mic"></i></a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/jquery/js/jquery.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/popper.js/js/popper.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/bootstrap/js/bootstrap.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/imagesloaded/js/imagesloaded.pkgd.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/isotope-layout/js/isotope.pkgd.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/slick-carousel/js/slick.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/sal.js/sal.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/magnific-popup/js/jquery.magnific-popup.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/mcustomscrollbar/jquery.mCustomScrollbar.concat.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/select2/js/select2.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/elevate-zoom/jquery.elevatezoom.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/static/dependencies/bootstrap-validator/js/validator.min.js"></script>--%>
<script src="${pageContext.request.contextPath}/static/js/jquery-1.12.4.js"></script>
<script>
</script>
</body>
</html>
